<template>
  <aside class="site-sidebar" :class="'site-sidebar--' + sidebarLayoutSkin">
    <div class="site-sidebar__inner">
      <el-menu
        :default-active="menuActiveName || 'dashboard'"
        :default-openeds="['main']"
        :collapse="sidebarFold"
        :collapseTransition="false"
        class="site-sidebar__menu">
        <el-submenu index="main">
          <template slot="title">
            <i class="el-icon-setting"></i>
            <span>主菜单</span>
          </template>
          <el-menu-item index="prize-list" @click="bundleMenu">
            <i class="el-icon-menu"></i>
            <span slot="title">特惠券包</span>
          </el-menu-item>
          <el-menu-item index="activity-list" @click="orderMenu">
             <i class="el-icon-menu"></i>
            <span slot="title">订单管理</span>
          </el-menu-item>
        </el-submenu>
        <!-- <sub-menu
          v-for="menu in menuList"
          :key="menu.menuId"
          :menu="menu"
          :dynamicMenuRoutes="dynamicMenuRoutes">
        </sub-menu> -->
      </el-menu>
    </div>
  </aside>
</template>

<script>
export default {
  props: ['currentMenu'],

  data() {
    return {
    };
  },
  computed: {
    sidebarLayoutSkin: {
      get() { return this.$store.state.common.sidebarLayoutSkin }
    },
    sidebarFold: {
      get() { return this.$store.state.common.sidebarFold }
    },
    menuActiveName: {
      get() { return this.$store.state.common.menuActiveName },
      set(newName) { this.$store.commit('common/updateMenuActiveName', newName) }
    }
  },
  watch: {
    $route: 'handleRouteChange'
  },
  methods: {
    bundleMenu(){
      this.$router.push({ path:'/bundle'  });
      this.menuActiveName = 'prize-list';
    },
    orderMenu(){
      this.$router.push({ path:'/bundle/order/list'  });
      this.menuActiveName = 'activity-list';
    },
    handleRouteChange(route) {
      console.log(route.meta && route.meta.menuId);
      if (route.meta && route.meta.menuId) {
        this.menuActiveName = route.meta.menuId;
      }
    }
  },
  
  mounted() {
    this.handleRouteChange(this.$route);
  }
}
</script>


<style lang="scss" scoped>
.sidebar {

}
</style>